.wrapper{
    width: 100%;
    height: 100%;
}

.wrapper header{
    width: 100%;
    height: 13vw;
    background-color: #51b9fe;
    justify-content: center;
    display: flex;
    align-items: center;

    font-size: 4.5vw;
    color: #fff;
}

.wrapper .user-info{
    width: 100%;
    height: 33vw;
    justify-content: center;
    margin-top: 5vw;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.wrapper .user-info li{
    box-sizing: border-box;
    padding: 4vw 3vw 0 3vw;
    display: flex;
    margin-left: 3vw;
    font-size: 3vw;
    align-items: center;
}

.wrapper .user-info li .check-box{
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction:row;
    
}

.wrapper .user-info li .title{
    flex: 0 0 18vw;
    font-size: 3vw;
}

.wrapper .user-info li .lineedit{
    border: 0px;
    border-bottom: solid 1px rgb(114, 86, 86);
    font-size: 3vw;
}

.wrapper .check-box{
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction:row;
    margin-left: 3vw;
    font-size: 3vw;
}

.wrapper .check-box input{
    width: 3vw;
    height: 3vw;
    margin-right: 3vw;
}

.wrapper .log-reg{
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction:column;
}

.wrapper .log-reg li{
    margin-top: 6vw;
}

.wrapper .log-reg li button{
    width: 70vw;
    height: 8vw;
    border-radius: 3vw;
    border: none;
    font-size: 3vw;
}







/*****************四个按钮****************/
.wrapper .footer{
 width: 100%;
 height: 14vw;
 border-top: solid 1px #DDD;
 background-color: #fff;
 position: fixed;
 left: 0;
 bottom: 0;
 display: flex;
 justify-content: space-around;
 align-items: center;
 }
 .wrapper .footer li{
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 color: #999;
 user-select: none;
 cursor: pointer;
 }
 .wrapper .footer li p{
 font-size: 2.8vw;
 }
 .wrapper .footer li i{
 font-size: 5vw;
 }